<template>
  <div>
    <newHeader/>

    <!-- S 轮播模块 -->
    <swiperComponent/>
    <!-- E 轮播模块 -->

    <div class="m-content wrapbox clearfix">
      <div class="m-centbar">
        <h1>{{detais.newsTitle}}</h1>
        <div class="txtcont">
          <span class="time">{{detais.infopubldate}}</span>
         
          <ul class="iconlist">
            <li class="zan">
              <a href="javascript:;"><i class="s"></i>{{detais.likes}}</a>
            </li>
            <li class="share">
              <a href="javascript:;"><i class="s"></i>{{detais.shares}}</a>
              <div class="sharebox" style="display:block;">
                <span class="arr"></span>
                <a href="#"><img src="../images/share-1.png" width="34" height="34"/>复制链接</a>
                <a href="#"><img src="../images/share-2.png" width="34" height="34"/>复制链接</a>
                <a href="#"><img src="../images/share-3.png" width="34" height="34"/>复制链接</a>
                <a href="#"><img src="../images/share-4.png" width="34" height="34"/>复制链接</a>
                <span class="code"><img src="../images/share-5.png" width="134" height="134"/></span>
              </div>
            </li>
            <li class="comment">
              <a href="javascript:;"><i class="s"></i>{{detais.comments}}</a>
            </li>
          </ul>
        </div>
        <div class="artcont">
          <p>{{detais.content}}
          </p>
        </div>
      </div>
      <!-- s 评论模块 -->
      <div class="m-comment">
        <div class="setmsg">
          <textarea name="" rows="" cols="" placeholder="说点什么..."></textarea>
          <p class="btn">
            <a href="#">发表评论</a>
          </p>
        </div>
        <div class="m-comment-list">
                    <span class="pic">
                    <img src="images/img01.png" width="62" height="62" alt=""/>
                </span>
          <div class="hd clearfix">
            <ul class="cxbar">
              <li><a href="#"><i class="s sed"></i>8763</a></li>
              <li><a href="#">回复</a></li>
              <li><a href="#">举报</a></li>
            </ul>
            <span class="name">头条资讯</span>
          </div>
          <div class="bd">
            <p class="txt">评论内容评论内容评论内容评论内容</p>
          </div>
        </div>
        <div class="m-comment-list">
                    <span class="pic">
                    <img src="images/img01.png" width="62" height="62" alt=""/>
                </span>
          <div class="hd clearfix">
            <ul class="cxbar">
              <li><a href="#"><i class="s"></i>8763</a></li>
              <li><a href="#">回复</a></li>
              <li><a href="#">举报</a></li>
            </ul>
            <span class="name">头条资讯</span>
          </div>
          <div class="bd">
            <p class="txt">评论内容评论内容评论内容评论内容</p>
            <!-- s 回复输入框 -->
            <div class="reply">
              <textarea name="" rows="" cols="" placeholder="回复 风清扬"></textarea>
              <p class="btn">
                <a href="#">回复</a>
              </p>
            </div>
            <!-- e 回复输入框 -->
          </div>
        </div>
        <div class="m-comment-list">
                    <span class="pic">
                    <img src="images/img01.png" width="62" height="62" alt=""/>
                </span>
          <div class="hd clearfix">
            <ul class="cxbar">
              <li><a href="#"><i class="s"></i>8763</a></li>
              <li><a href="#">回复</a></li>
              <li><a href="#">举报</a></li>
            </ul>
            <span class="name">头条资讯</span>
          </div>
          <div class="bd">
            <p class="txt">评论内容评论内容评论内容评论内容</p>
            <!-- s 回复留言 -->
            <div class="leavemsg">
              <div class="lmlist">
                <a class="det" href="#">删除</a>
                <p>七月与流火：</p>
                <p>长大了自己能养活自己，就可以远离他了。</p>
              </div>
              <div class="lmlist">
                <a class="det" href="#">删除</a>
                <p>七月与流火：</p>
                <p>长大了自己能养活自己，就可以远离他了。</p>
              </div>
            </div>
            <!-- e 回复留言 -->
          </div>
        </div>
        <!-- s 点击加载更多-->
        <a href="#" class="morebtn">
          <span></span>
        </a>
        <!-- e 点击加载更多-->
        <!-- s 弹窗 -->
        <div class="m-alertbox m-alertbox01">
          <div class="hd">
            <h2>举报</h2>
            <a href="#" class="close"><span>关闭</span></a>
          </div>
          <div class="bd">
            <p class="t">请选择举报项目</p>
            <ul>
              <li>
                <input type="checkbox" name="" id="male"/>
                <label for="male">举报项一举报项一举报项一</label>
              </li>
              <li>
                <input type="checkbox" name="" id="male2"/>
                <label for="male2">举报项一举报项一举报项一</label>
              </li>
              <li>
                <input type="checkbox" name="" id="male3"/>
                <label for="male2">举报项一举报项一举报项一</label>
              </li>
            </ul>
            <p class="t">其它</p>
            <textarea name="" rows="" cols="" placeholder=""></textarea>
            <p class="btn">
              <a href="#">提交举报</a>
            </p>
          </div>
        </div>
        <!-- e 弹窗 -->
        <!-- s 弹窗 -->
        <div class="m-alertbox m-alertbox02">
          <div class="hd">
            <h2>提示</h2>
            <a href="#" class="close"><span>关闭</span></a>
          </div>
          <div class="bd">
            <p class="t">确认删除该评论？</p>
          </div>
          <div class="ft">
            <a href="#">取消</a>
            <a href="#">确认</a>
          </div>
        </div>
        <!-- e 弹窗 -->
      </div>

    </div>


    <bottom/>
  </div>
</template>
<script>
  import bottom from '@/components/Bottom'
  import newHeader from '@/components/NewHeader'
  import swiperComponent from '@/components/SSwiper'

  export default {
    data() {
      return {
        detais: '',
      }
    },
    components: {
      bottom,
      newHeader,
      swiperComponent,

    },
    mounted() {
      this.id = this.$route.params.id //拿到通过路由传过来的ID
      this.getDetail(this.id)
      // this.getCommens(this.id)
    },

    methods: {
      getDetail(id) {
        let params = {
          'newsId': id
        }
        this.$fetch('/indexNews/getNewInfo', params).then(response => {
          this.$check(response)
          this.detais = response.data
        })
      },
//		获取评论
//       getCommens(id) {
//         this.$fetch('/indexNews/getNewsCommentList' + '?newsId=' + id + '&commentType=1').then(response => {
//           let r = response.data
//           console.log(r)
//           if (r != null && r.length > 0) {
//             this.commentslist = r
//           } else {
//             this.vs = !this.vs
//             this.isvs = !this.isvs
//           }
//         })
//
//       }
    }
  }
</script>

<style scoped>

</style>
